define(['vue-quill-editor'],function (VueQuillEditor) {
    var returnVisitPlanModal = {
        name: 'return-visit-plan-modal',
        components: {
            quillEditor:VueQuillEditor.quillEditor
        },
        template: '' +
        '<Modal ' +
        '   title="填写最新回访记录" ' +
        '   v-model="insideShow" ' +
        '   ok-text="提交最新回访记录" ' +
        '   width="650" ' +
        '   @on-ok="handleSubmit" '+
        '   @on-cancel="handleCancel" '+
        '   class-name="newVisit vertical-center-modal">' +
        '  <div>' +
        '    <ol class="clearfix">' +
        '      <li class="selectItem">' +
        '        <Select v-model="returnVisitTypeModel" placeholder="回访类型" >' +
        '          <Option v-for="item in returnVisitType" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '      </li>' +
        '      <li class="selectItem">' +
        '        <Row>' +
        '          <Col span="12">' +
        '            <DatePicker type="date"  placeholder="回访时间" style="width:160px"></DatePicker>' +
        '          </Col>' +
        '        </Row>' +
        '      </li>' +
        '      <li class="selectItem">' +
        '        <Select v-model="visitingPersonnelModel" placeholder="回访人员">' +
        '          <Option v-for="item in visitingPersonnel" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '      </li>' +
        '      <li class="selectItem" style="width: 170px;">' +
        '        <Select v-model="connectionModel" placeholder="接通情况">' +
        '          <Option v-for="item in connection" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '      </li>' +
        '    </ol>' +
        '  </div>' +
        '  <div class="clearfix">' +
        '   <ol v-show="showMeet">' +
        '    <li class="selectItem">' +
        '      <Select v-model="customer1Model" placeholder="带看客户" class="selectItem">' +
        '        <Option v-for="item in customer1" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '    </li>' +
        '    <li class="selectItem">' +
        '      <Select v-model="customer2Model" placeholder="带看客户" class="selectItem">' +
        '        <Option v-for="item in customer2" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '    </li>' +
        '    <li class="selectItem">' +
        '      <Select v-model="customer3Model" placeholder="带看客户" class="selectItem">' +
        '        <Option v-for="item in customer3" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '    </li>' +
        '    <li class="selectItem">' +
        '      <Select v-model="purchaseIntentionModel" placeholder="购买意向" style="width: 170px;">' +
        '        <Option v-for="item in purchaseIntention" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>' +
        '    </li>' +
        '   </ol>' +
        '  </div>' +
        '<quill-editor ' +
        '       class="editor"'+
        '       v-model="content" ' +
        '       ref="myQuillEditor" ' +
        '       :options="editorOption" ' +
        '       @blur="onEditorBlur($event)" ' +
        '       @focus="onEditorFocus($event)" ' +
        '       @ready="onEditorReady($event)">' +
        '</quill-editor>'+
        '<div class="nextPlan clearfix">'+
        '  <h3>定制下次回访计划</h3>'+
        '  <ol class="clearfix">'+
        '    <li class="selectItem">'+
        '      <Select v-model="planReturnVisitTypeModel" placeholder="计划回访类型" class="selectItem">'+
        '        <Option v-for="item in planReturnVisitType" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>'+
        '    </li>'+
        '    <li class="selectItem">'+
        '      <Row>'+
        '        <Col span="12">'+
        '          <DatePicker type="date" placeholder="计划回访时间" style="width:160px"></DatePicker>'+
        '        </Col>'+
        '      </Row>'+
        '    </li>'+
        '    <li class="lineSpace" v-show="!showMeet">'+
        '    </li>'+
        '    <li v-show="showMeet" class="selectItem">'+
        '      <Select v-model="customer4Model" placeholder="带看客户" class="selectItem">'+
        '        <Option v-for="item in customer4" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>'+
        '    </li>'+
        '    <li v-show="showMeet" class="selectItem">'+
        '      <Select v-model="seeStatusModel" placeholder="房源带看状态" style="width: 169px;">'+
        '        <Option v-for="item in seeStatus" :value="item.value" :key="item.value">{{ item.label }}</Option></Select>'+
        '    </li>'+
        '  </ol>'+
        '</div>'+
        '</Modal>',
        model: {
            prop: 'isShowReturnVisitPlanModal',
            event: 'change-show'
        },
        props: {
            isShowReturnVisitPlanModal: {
                type: Boolean,
                default: false
            }
        },
        watch: {
            isShowReturnVisitPlanModal: function (val) {
                this.$data.insideShow = val
            },
            insideShow: function (val) {
                this.$emit('change-show', val)
            },
            returnVisitTypeModel: function () {

                this.showMeet = this.returnVisitTypeModel === this.returnVisitType[1].value

                switch (this.returnVisitTypeModel){
                    case this.returnVisitType[0].value: {
                        this.planReturnVisitTypeModel = this.planReturnVisitType[0].value
                        break
                    }
                    case this.returnVisitType[1].value: {
                        this.planReturnVisitTypeModel = this.planReturnVisitType[1].value
                        break
                    }
                }
            },
            planReturnVisitTypeModel: function () {

                this.showMeet = this.planReturnVisitTypeModel === this.planReturnVisitType[1].value

                switch (this.planReturnVisitTypeModel){
                    case this.planReturnVisitType[0].value: {
                        this.returnVisitTypeModel = this.returnVisitType[0].value
                        break
                    }
                    case this.planReturnVisitType[1].value: {
                        this.returnVisitTypeModel = this.returnVisitType[1].value
                        break
                    }
                }
            }
        },
        computed: {
            editor: function() {
                return this.$refs.myTextEditor.quill
            }
        },
        data: function () {
            return {
                content: '',
                editorOption: {
                    theme: 'bubble',
                    placeholder: "请输入追踪情况，按“提交回访情况”进行提交 ",
                    modules: {
                        toolbar: [
                            ['bold', 'italic', 'underline', 'strike'],
                            [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                            [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
                            [{ 'color': [] }, { 'background': [] }],
                            [{ 'font': [] }],
                            [{ 'align': [] }],
                            ['link', 'image'],
                            ['clean']
                        ]
                    }
                },
                planReturnVisitTypeModel:'',
                planReturnVisitType:[
                    {
                        value: '计划电话回访',
                        label: '计划电话回访'
                    }  ,
                    {
                        value: '计划带看回访',
                        label: '计划带看回访'
                    }
                ],
                returnVisitTypeModel:'',
                returnVisitType:[
                    {
                        value: '电话回访',
                        label: '电话回访'
                    }  ,
                    {
                        value: '带看回访',
                        label: '带看回访'
                    }
                ],
                visitingPersonnelModel:'',
                visitingPersonnel:[
                    {
                        value: '张三',
                        label: '张三'
                    }  ,{
                        value: '李四',
                        label: '李四'
                    }
                ],
                connectionModel:'',
                connection:[
                    {
                        value: '已接机',
                        label: '已接机'
                    }  ,{
                        value: '未接机',
                        label: '未接机'
                    }
                ],
                customer1Model:'',
                customer1: [
                    {
                        value: '业主一',
                        label: '业主一'
                    }  ,{
                        value: '业主二',
                        label: '业主二'
                    }
                ],
                customer2Model:'',
                customer2: [
                    {
                        value: '业主一',
                        label: '业主一'
                    }  ,{
                        value: '业主二',
                        label: '业主二'
                    }
                ],
                customer3Model:'',
                customer3: [
                    {
                        value: '业主一',
                        label: '业主一'
                    }  ,{
                        value: '业主二',
                        label: '业主二'
                    }
                ],
                customer4Model:'',
                customer4: [
                    {
                        value: '业主一',
                        label: '业主一'
                    }  ,{
                        value: '业主二',
                        label: '业主二'
                    }
                ],
                purchaseIntentionModel:'',
                purchaseIntention:[
                    {
                        value: '意向一般',
                        label: '意向一般'
                    },
                    {
                        value: '意向较弱',
                        label: '意向较弱'
                    },{
                        value: '意向强烈',
                        label: '意向强烈'
                    }
                ],
                seeStatusModel:'',
                seeStatus:[
                    {
                        value: '已看',
                        label: '已看'
                    },
                    {
                        value: '未看',
                        label: '未看'
                    }
                ],
                showMeet: false,
                insideShow: this.isShowReturnVisitPlanModal,
            };
        },
        methods: {
            handleSubmit: function () {
                debugger
                console.log(this.content)
            },
            handleCancel: function () {
                console.log('取消')
            },
            onEditorBlur :function(editor) {

            },
            onEditorFocus: function(editor) {

            },
            onEditorReady: function(editor) {

            }
        }
    }
    return returnVisitPlanModal
})
